<template>
  <h2>App组件</h2>
  <hr />
  <A>
    <!-- 使用默认插槽的时候，如果标签数据使用template进行包裹，这个时候，需要给template指定默认插槽的插槽名:default -->
    <!-- v-slot:xxx -->
    <!-- #xxxx -->
    <template v-slot:default>
      <p>从前有座山</p>
      <p>山上有座庙</p>
    </template>
    <!-- 具名插槽 -->
    <template #content>
      <p>庙里有个老和尚</p>
      <p>长得真俊俏</p>
    </template>
    <template #footer="{ list }">
      <p v-for="item in list" :key="item.id">{{ item.title }}</p>
    </template>
  </A>
</template>
<script lang="ts" setup>
import A from "./components/A.vue";
</script>

<style lang="less" scoped></style>
